import {Button} from "antd";
import React, {FC, useCallback, useMemo} from "react";
import {useTranslation} from "react-i18next";
import {updateMenu} from "../../services/MenuService.tsx";
import BaseForm from "../form/BaseForm.tsx";

interface EditMenuItemProps {
    key: string,
    initValues?: any,
    view: any[]
}

const EditMenuItem: FC<EditMenuItemProps> = (props) => {

    const {t} = useTranslation();

    const handleSave: Function = useCallback((params: any) => {
        updateMenu(params)
    }, [props]);

    const renderEditMenuItem = useMemo(() => {
        if (!props.view || props.view.length == 0) {
            return null;
        }
        return (
            <BaseForm
                formItemLayout={1}
                labelWidth={120}
                view={props.view}
                initValues={props.initValues}
                onSubmit={handleSave}
            >
                <Button
                    size={"small"}
                    htmlType="submit"
                    type="primary">{t("save")}</Button>
            </BaseForm>
        )
    }, [props])

    return (renderEditMenuItem)
};

export default EditMenuItem;